<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="basePath.jsp"%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Easy Manage</title>

    <!-- Bootstrap -->
    <link href="<%=viewPath %>/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    
    <!-- Bootstrap -->
    <link href="<%=viewPath %>/toastr/toastr.min.css" rel="stylesheet" type="text/css" />

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="//cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <style>
        h1 {
            font-size: 3.5em;
            margin-top: 6%;
            margin-bottom: 4%
        }

        .login-form {
            padding-left: 3%;
            padding-right: 3%
        }

        .group-gap {
            margin-bottom: 8%;
        }

        .sign-up {
            float: right;
        }
        
        .footer {
    		position: absolute;
    		bottom: 0;
    		width: 100%;
    		/* Set the fixed height of the footer here */
    		height: 4em;
    		/*background-color: #f5f5f5;*/
    		padding:20px;
		}
    </style>
</head>
<body>
<div class="container">
    <div class="row-fluid">
        <div class="col-md-12">
            <h1 class="text-center text-primary">
                Easy Manage
            </h1>
        </div>
    </div>
    <div class="row-fluid">
        <div class="col-xs-2 col-md-4"></div>
        <div class="col-xs-8 col-md-4  login-form">
            <form method='post' action="<%=path %>/login" method="POST">
                <input type="hidden" name="_token" value="2nPiqKNo7g6u7HoISkcFWca45dPEJvvl5wpSwntG" />
                <div class="form-group group-gap">
                    <input  type="text" class="form-control input-lg" name="username" 
                           placeholder="username" />
                </div>
                <div class="form-group group-gap ">
                    <input  type="password" class="form-control input-lg" name="password" 
                           placeholder="password" />
                </div>
                <div class="form-group group-gap ">
                    <div class="checkbox extraMsg">
                        <label>
                            <input type="checkbox" name="remember" value="true"> remember me</input>
                        </label>
                    </div>
                </div>
                <div class="form-group group-gap ">
                    <button type="submit" class="btn btn-block btn-primary btn-lg btn-login">Login</button>
                </div>
            </form>
        </div>
        <div class="col-xs-2 col-md-4"></div>
    </div>
</div>


<footer class="footer">
    <div class="container">
        <p class="text-center text-primary">Copyright &copy;2016 DevOps,from NanJing University</p>
    </div>
</footer>
<!--
    <footer class="footer">

</footer>
-->

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="<%=viewPath %>/js/lib/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="<%=viewPath %>/bootstrap/js/bootstrap.min.js"></script>
<script src="<%=viewPath %>/toastr/toastr.min.js"></script>
<script>  
<%if(request.getAttribute("loginFailed")!=null){
	String msg=(String)request.getAttribute("loginFailed");
%>
toastr.options = {
		  "closeButton": false,
		  "debug": false,
		  "newestOnTop": false,
		  "progressBar": true,
		  "positionClass": "toast-top-right",
		  "preventDuplicates": false,
		  "onclick": null,
		  "showDuration": "300",
		  "hideDuration": "1000",
		  "timeOut": "3000",
		  "extendedTimeOut": "1000",
		  "showEasing": "swing",
		  "hideEasing": "linear",
		  "showMethod": "fadeIn",
		  "hideMethod": "fadeOut"
}
toastr.error("<%=msg%>");
<%}%>
</script>
</body>
</html>